<!DOCTYPE html>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<script src="${ctxWebStatic}/laydate/laydate.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
	    <meta http-equiv="Cache-Control" content="no-cache" />
	    <meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
		<meta content="telephone=no,email=no,address=no" name="format-detection">
		<link rel="stylesheet" href="${ctxWebStatic}/css/bootstrap.min.css" />
		<link rel="stylesheet" href="${ctxWebStatic}/css/font-awesome.min.css" />
		<link rel="stylesheet" href="${ctxWebStatic}/css/reset.css" />
		<link rel="stylesheet" href="${ctxWebStatic}/css/index.css" />
		<script type="text/javascript" src="${ctxWebStatic}/js/jquery-1.11.1.min.js" ></script>
		<script type="text/javascript" src="${ctxWebStatic}/js/bootstrap.min.js" ></script>
		<script type="text/javascript" src="${ctxWebStatic}/js/placeholdr.js" ></script>
		<script type="text/javascript" src="${ctxWebStatic}/js/top_nav.js" ></script>
		<link href="${ctxWebStatic}/jquery-validation/1.11.0/jquery.validate.css" type="text/css" rel="stylesheet" />
		<script src="${ctxWebStatic}/jquery-validation/1.11.0/jquery.validate.js" type="text/javascript"></script>
		<script src="${ctxWebStatic}/jquery-validation/1.11.0/jquery.validate.method.js" type="text/javascript"></script>
		<!--[if lt IE 9]>
	      <script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
	      <script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
	    <![endif]-->
   	    <link rel="Shortcut Icon" href="${ctxWebStatic}/images/bitbug_favicon.ico" />
	    
<head>
<title>企业认证</title>
<style type="text/css">
em.error {
	height: 18px;
	display: inline-block;
	vertical-align: middle;
	margin-right: 2px;
	margin-left: 20px;
	background: url("${ctxWebStatic}/images/error_img.png") no-repeat 0px
		0px;
	padding-left: 24px;
	color: #d3001e;
	font-size: 16px;
	font-family: "微软雅黑";
}
</style>
<script type="text/javascript">
	//防止重复提交
	var subflag = false;
	$(document).ready(function() {
		
		$('.FileImg').click(function(){
			$(this).prev('input').click();
		})
		//回选
		provinceInt($("#province").get(0));
		$("#form").validate({
			rules : {
				company : {
					required : true,
					minlength : 5,
					CEStar : true
				},
				companyType : {
					required : true
				},
				companySize : {
					required : true
				},
				province : {
					required : true
				},
				city : {
					required : true
				},
				address : {
					required : true,
					minlength : 5
				},
				linkman : {
					required : true,
					minlength : 2
				},
				linkmanPhone : {
					required : true,
					minlength : 11,
					number : true,
					remote : { 
						type : "POST",
						url : "${ctxWeb}/register/checkLinkmanPhone", 
						data : {
							linkmanEmail : function() {
								return $("#linkmanPhone").val();
							},
							id : function() {
								return "${user.id}";
							}
						}
					}
				},
				linkmanEmail : {
					required : true,
					remote : { 
						type : "POST",
						url : "${ctxWeb}/register/checkLinkmanEmail", 
						data : {
							linkmanEmail : function() {
								return $("#linkmanEmail").val();
							},
							id : function() {
								return "${user.id}";
							}
						}
					}
				}
			},

			messages : {
				company : {
					required : '请输入企业名称',
					minlength : '请输入 5-30个字符，以汉字或字母开头，可带数字'
				},
				companyType : {
					required : '请选择企业类型'
				},
				companySize : {
					required : '请选择企业规模'
				},
				province : {
					required : '请选择省'
				},
				city : {
					required : '请选择市'
				},
				address : {
					required : '请输入详细地址',
					minlength : '不得少于5个字'
				},
				linkman : {
					required : '请输入联系人'
				},
				linkmanPhone : {
					required : '请输入电话号码',
					minlength : '格式不正确',
					number : '格式不正确',
					remote : '已存在的电话'
				},
				linkmanEmail : {
					required : '请输入电子邮箱',
					remote : '已存在的邮箱'
				}
				
			},

			errorElement : "em",
		}
		
		);

		$("select").change(function() {
			if (parseInt($(this).val())) {
				$(this).css("color", "#333")
			} else {
				$(this).css("color", "#CCC")
			}
		})

		/*
		$('.fileBtn').click(function() {
			$(this).parent().prev('input[type="file"]').click();
		})
		*/

		/*
		$('.uploadImg').change(function() {
			console.log($(this)[0].files[0]);
			var input = $(this)
			//$(this).next().find('img').attr('src',$(this)[0].files[0])
			var file = $(this)[0].files[0];
			var reader = new FileReader();
			reader.onload = function(e) {
				imgFile = e.target.result;
				console.log(imgFile);
				input.next().find('img').attr('src', imgFile);
			};
			reader.readAsDataURL(file);
		})*/
	});

	function webLogin() {
		if ($("#username").val() == "") {
			$("#errMessage").html("用户名不能为空");
			$("#err_tip").css("display", "inline");
			return;
		}
		if ($("#password").val() == "") {
			$("#errMessage").html("密码不能为空");
			$("#err_tip").css("display", "inline");
			return;
		}
		$("#loginForm").submit();
	}

	function sub() {
		if (subflag) {
			return;
		}
		var checkFlag = true;

		if (!$("#form").valid()) {
			checkFlag = false;
		}

		if (!checkFlag) {
			return false;
		}
		$("form").submit();
		subflag = true;
	}
	
	//省切换
	function provinceChange(obj){
		if(obj.value != ""){
			$.ajax({
				data : {
					"parentId" : obj.value
				},
				type : "post",
				async : false,
				url : "${ctxWeb}/area/getCity",
				dataType : "json",
				success : function(data) {
					$(obj).css("color", "#333");
					$("#city").html("<option value=''>请选择市</option>");
					for(var i=0;i<data.length;i++){
						
						$("#city").append("<option value='"+data[i].id+"'>"+data[i].name+"</option>");
					}
				},
				error : function(data) {
					alert("网络异常");
				}
			})
		}else{
			
		}
	}
	
	function provinceInt(obj){
		if(obj.value != ""){
			$.ajax({
				data : {
					"parentId" : obj.value
				},
				type : "post",
				async : false,
				url : "${ctxWeb}/area/getCity",
				dataType : "json",
				success : function(data) {
					$(obj).css("color", "#333");
					$("#city").css("color", "#333");
					$("#city").html("<option value=''>请选择市</option>");
					for(var i=0;i<data.length;i++){
						if("${user.city}" == data[i].id){
							$("#city").append("<option value='"+data[i].id+"' selected='selected'>"+data[i].name+"</option>");
						}else{
							$("#city").append("<option value='"+data[i].id+"'>"+data[i].name+"</option>");
						}
					}
				},
				error : function(data) {
					alert("网络异常");
				}
			})
		}else{
			
		}
	}
	
	 function showPic(obj) {  
	      var fullPath = getFullPath(obj);
	      if (fullPath) {  
	           $(obj).next('.FileImg').find('img').attr('src',fullPath);
	      }
	  }
	 
		function getFullPath(obj) {  
		      if (obj) {  
		    	  if(obj.files[0] == undefined){
		    		  return;
		    	  }
		    	  if(obj.files[0].size >= 4194304){
		    		  alert("文件不能大于4MB");
		    		  return;
		    	  }
		          //Internet Explorer   
		          if (window.navigator.userAgent.indexOf("MSIE") >= 1) {  
		              obj.select();
		             
		              return document.selection.createRange().text;  
		          }   
		          //Firefox  
		          if (window.navigator.userAgent.indexOf("Firefox") >= 1) {  
		              if (obj.files) {  
		                  return window.URL.createObjectURL(obj.files[0]);
		              }  
		              return obj.value;  
		          }   
		    
		          //兼容chrome、火狐等，HTML5获取路径         
		          if (typeof FileReader != "undefined") {  
		              var reader = new FileReader();  
		              reader.onload = function(e) {  
		                  //document.getElementById("pic").src = e.target.result + ""; 
		                  $(obj).next('.FileImg').find('img').attr('src',e.target.result);
		              }  
		              reader.readAsDataURL(obj.files[0]);  
		          } else if (browserVersion.indexOf("SAFARI") > -1) {  
		              
		          }  
		    
		      }   
		  }  
</script>
</head>
<body>
	<div class="page">
		<jsp:include page="/WEB-INF/views/layouts/top_nomal.jsp"></jsp:include>
		<!--主体-->
		<div class="main_user_resigt">
			<div class="container">
				<div class="row">
					<div class="title_nav">
						<div class="line1"></div>
						<h4>企业信息</h4>
					</div>
					<form:form id="form" action="${ctxWeb}/register/associator" modelAttribute="user" method="post" enctype="multipart/form-data">
						<div class="form-group clearfix">
							<label for="firstname"
								class="col-sm-3 col-xs-4 input_info control-label"> <i
								class="must_img"></i>营业执照名称：
							</label>
							<div class="col-sm-9 col-xs-8 input_left">
								<form:input path="company" type="text" class="form-control" maxlength="30"
									id="company" placeholder="请输入营业执照上企业名称" />
							</div>
						</div>
						<div class="form-group clearfix">
							<label for="firstname"
								class="col-sm-3 col-xs-4 input_info control-label"> <i
								class="must_img"></i>企业类型：
							</label>
							<div class="col-sm-9 col-xs-8 input_left">
								<form:select path="companyType" id="companyType" style="color:#333"
									class="form-control hy">
									<form:options items="${companyType}" itemLabel="label"
										itemValue="value" />
								</form:select>
							</div>
						</div>
						<div class="form-group clearfix">
							<label for="firstname"
								class="col-sm-3 col-xs-4 input_info control-label"> <i
								class="must_img"></i>企业规模：
							</label>
							<div class="col-sm-9 col-xs-8 input_left">
								<form:select path="companySize" id="companySize" style="color:#333"
									class="form-control hy">
									<form:options items="${companySize}" itemLabel="label"
										itemValue="value" />
								</form:select>
							</div>
						</div>

						<div class="form-group clearfix">
							<label for="firstname"
								class="col-sm-3 col-xs-4 input_info control-label"> <i
								class="must_img"></i>企业所在地：
							</label>
							<div class="col-sm-9 col-xs-8 input_left">
								<div data-toggle="distpicker" class="dist_address">
									<form:select path="province" id="province" class="hy" onchange="provinceChange(this)">
										<option value="">请选择省</option>
										<form:options items="${province}" itemLabel="name" itemValue="id" />
									</form:select> 
									<form:select path="city" id="city" data-city="请选择市" class="hy">
										<option value="">请选择市</option>
									</form:select>
								</div>
								<form:input type="text" path="address" id="address" maxlength="50" class="form-control" placeholder="请输入企业详细地址"/>
							</div>
						</div>
						<div class="form-group clearfix">
							<label for="firstname"
								class="col-sm-3 col-xs-4 input_info control-label"> <i
								class="attenion"></i>企业信息上传：
								<p class="pos_atten">注：若办理过三证合一，则只需上传营业执照</p>
							</label>
							<div class="col-sm-9 col-xs-8">
								<div class="img_list">
									<figure class="up_img col-xs-4 marl15">
									  <input type="file" name='image1' onchange="showPic(this)" style='display:none' />
									  <div class="FileImg"  >				   
									 	 <img class='change_photo' src="${ctxWebStatic}/images/zw_img.png" alt="" /> <a
												href="javascript:void(0)" class="fileBtn">门头照片</a>
									  </div> 
									</figure>
									<figure class="up_img col-xs-4">
										<input type="file" name='image2' onchange="showPic(this)" style='display:none' />
										<div class="FileImg">
											<img class='change_photo' src="${ctxWebStatic}/images/zw_img.png" alt="" /> <a
												href="javascript:void(0)" class="fileBtn">营业执照</a>
										</div>
									</figure>
									<figure class="up_img col-xs-4">
										<input type="file" name='image3' onchange="showPic(this)" style='display:none' />
										<div class="FileImg">
											<img class='change_photo' src="${ctxWebStatic}/images/zw_img.png" alt="" /> <a
												href="javascript:void(0)" class="fileBtn">银行开户许可证</a>
										</div>
									</figure>
									<figure class="up_img col-xs-4 marl15">
										<input type="file" name='image4' onchange="showPic(this)" style='display:none' />
										<div class="FileImg">
											<img class='change_photo' src="${ctxWebStatic}/images/zw_img.png" alt="" /> <a
												href="javascript:void(0)" class="fileBtn">组织机构代码证</a>
										</div>
									</figure>
									<figure class="up_img col-xs-4">
										<input type="file" name='image5' onchange="showPic(this)" style='display:none' />
										<div class="FileImg">
											<img class='change_photo' src="${ctxWebStatic}/images/zw_img.png" alt="" /> <a
												href="javascript:void(0)" class="fileBtn">税务登记证</a>
										</div>
									</figure>
								</div>
							</div>
						</div>
						<div class="title_nav title_form_nav">
							<div class="line1"></div>
							<h4>联系人信息</h4>
						</div>

						<div class="form-group clearfix">
							<label for="firstname"
								class="col-sm-3 col-xs-4 input_info control-label"> <i
								class="must_img"></i>联系人：
							</label>
							<div class="col-sm-9 col-xs-8 input_left">
								<form:input id="linkman" path="linkman" maxlength="10" type="text" class="form-control" placeholder="请输入企业联系人"/>
							</div>
						</div>
						<div class="form-group clearfix">
							<label for="firstname"
								class="col-sm-3 col-xs-4 input_info control-label"> <i
								class="must_img"></i>电话号码：
							</label>
							<div class="col-sm-9 col-xs-8 input_left">
								<form:input type="tel" id="linkmanPhone" path="linkmanPhone" maxlength="11" class="form-control" placeholder="请输入联系人电话号码"/>
							</div>
						</div>
						<div class="form-group clearfix">
							<label for="firstname"
								class="col-sm-3 col-xs-4 input_info control-label"> <i
								class="must_img"></i>电子邮箱：
							</label>
							<div class="col-sm-9 col-xs-8 input_left">
								<input type="email" id="linkmanEmail" name="linkmanEmail" 
								<c:choose>
									<c:when test="${user.linkmanEmail == null}">
										value="${webUser.email}"
									</c:when>
									<c:otherwise>
										value="${user.linkmanEmail}"
									</c:otherwise>
								</c:choose>
								 class="form-control" placeholder="请输入电子邮箱"/>
							</div>
						</div>
					</form:form>
					<p class="register_btn mar_t30 col-sm-offset-3 col-xs-offset-4">
						<a href="javascript:void(0)" onclick="sub()">提交认证</a>
					</p>
				</div>
			</div>
		</div>
		<!--主体结束-->
		<!--foot-->
		<jsp:include page="/WEB-INF/views/layouts/buttom_2.jsp"></jsp:include>
		<!--foot结束-->
	</div>
</body>
</html>
